<template>
  <div class="type">
    <van-nav-bar
      title="找医生"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    >
      <template #right>
        <van-icon name="search" size="18" />
      </template>
    </van-nav-bar>
    <div class="center">
      <van-tabbar v-model="active">
        <van-tabbar-item>按疾病找</van-tabbar-item>
        <van-tabbar-item>按医生找</van-tabbar-item>
        <van-tabbar-item>按医院找</van-tabbar-item>
      </van-tabbar>
      <typefind />
    </div>
  </div>
</template>

<script>
import Typefind from '@/components/second/Typefind'
export default {
  name: 'Type',
  data () {
    return {
      active: 0
    }
  },
  methods: {
    onClickLeft () {
      this.$router.go(-1)
    }
  },
  components: {
    Typefind
  }
}
</script>

<style lang="scss">
html,
body,
.type {
  height: 100%;
}
.type {
  display: flex;
  flex-direction: column;
  .van-tabbar {
    border-bottom: 1px solid #ccc;
    .van-nav-bar__text {
      color: #1989fa;
    }
  }
  .center {
    flex: 1;
    overflow-x: hidden;
  }
  .van-tabbar--fixed {
    height:50px;
    background-color: rgb(245, 245, 245);
    position: absolute;
    top: 46px;
    .van-tabbar-item__text {
      font-size: 14px;
    }
  }
}
</style>
